<template>
    <el-input
        ref="editor"
        class="
            rounded-lg
            bg-white
            m-2
            px-2
            py-2
            outline-none
            Serif-Bolder
            shadow-md
            transition
            flex
            items-center
        "
        :readonly="!editable"
        :value="value"
        @input="change"
        :type="type"
        autosize
        :placeholder="placeholder"
        resize="none"
    >
    </el-input>
</template>

<script>
import Input from "element-ui/lib/input.js";
export default {
    components: { elInput: Input },
    props: {
        placeholder: {
            type: String,
            default: "请输入内容",
        },
        type: {
            type: String,
            default: "textarea",
        },
        value: {
            type: String,
            default: "",
        },
        editable: {
            type: Boolean,
            default: true,
        },
    },

    methods: {
        change(value) {
            this.$emit("input", value);
        },
    },
};
</script>

<style lang="less" scoped>
pre {
    font-family: inherit;
    text-decoration: inherit;
}
</style>
